import type {
  CreateCrudOptionsProps,
  CreateCrudOptionsRet,
} from '@fast-crud/fast-crud';

import type { Recordable } from '@vben/types';

import { compute } from '@fast-crud/fast-crud';
import { AutoComplete } from 'ant-design-vue';

export function createCrudOptions(
  props: CreateCrudOptionsProps,
): CreateCrudOptionsRet {
  function emitJson() {
    const { emit } = props.context;
    const list: Recordable[] = props.crudExpose.getTableData();
    const json: Recordable = {};
    for (const obj of list) {
      let value = obj.value;
      if (value === 'false') {
        value = false;
      } else if (value === 'true') {
        value = true;
      } else if (/^\d+$/.test(value)) {
        value = Number.parseInt(value, 10);
      } else if (/^\d+\.\d+$/.test(value)) {
        value = Number.parseFloat(value);
      }
      json[obj.key] = value;
    }

    emit('update:modelValue', JSON.stringify(json));
  }
  return {
    crudOptions: {
      search: { show: false },
      toolbar: { show: false },
      pagination: { show: false },
      mode: {
        name: 'local',
        isMergeWhenUpdate: true,
        isAppendWhenAdd: true,
      },
      container: {
        is: 'fs-layout-default',
      },
      form: {
        col: { span: 24 },
        afterSubmit: emitJson,
      },
      table: {
        striped: true,
        remove: {
          afterRemove: emitJson,
        },
      },
      actionbar: {
        buttons: {
          add: { show: props.context.mode !== 'view' },
        },
      },
      rowHandle: {
        width: 120,
        buttons: {
          edit: {
            show: props.context.mode !== 'view',
          },
          view: { show: false },
          copy: { show: false },
          remove: {
            show: compute(() => {
              return props.context.mode !== 'view';
            }),
          },
        },
      },
      columns: {
        key: {
          title: 'key',
          type: 'text',
          form: {
            component: {
              name: AutoComplete,
              options: [
                { value: 'title', label: '标题名称' },
                { value: 'activeIcon', label: '激活图标（菜单）' },
                {
                  value: 'activePath',
                  label:
                    '当前激活的菜单，有时候不想激活现有菜单，需要激活父级菜单时使用',
                },
                { value: 'affixTab', label: '是否固定标签页' },
                { value: 'affixTabOrder', label: '固定标签页的顺序' },
                { value: 'badge', label: '徽标' },
                { value: 'badgeType', label: '徽标类型' },
                { value: 'badgeVariants', label: '徽标颜色' },
                {
                  value: 'hideInBreadcrumb',
                  label: '当前路由在面包屑中不展现',
                },
                { value: 'hideInTab', label: '当前路由在标签页不展现' },
                { value: 'keepAlive', label: '开启KeepAlive缓存' },
                { value: 'query', label: '菜单所携带的参数' },
              ],
            },
            rule: { required: true, message: '这是必填项' },
          },
        },
        value: {
          title: 'value',
          type: 'text',
          form: {
            rule: { required: true, message: '这是必填项' },
          },
        },
      },
    },
  };
}
